<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>学生个人信息</title>
    <link rel="stylesheet" href="/css/student.css">
    <script src="/js/jquery.js"></script>
</head>
<body>
    <div class="container">
        <!-- 导航栏 -->
        <div class="header">
            <h1>学生个人信息</h1>
            <div class="nav-buttons">
                <button type="button" class="btn btn-secondary" onclick="goBack()">返回列表</button>
                <!-- 只有管理员权限才显示编辑按钮 -->
                <button type="button" class="btn btn-primary" id="editProfileBtn" th:if="${hasAdminPermission}">编辑信息</button>
                <!-- 学生登录时显示提示信息 -->
                <span th:unless="${hasAdminPermission}" class="permission-notice">仅管理员可编辑学生信息</span>
            </div>
        </div>

        <!-- 个人信息卡片 -->
        <div class="profile-container">
            <!-- 基本信息卡片 -->
            <div class="profile-card">
                <div class="profile-header">
                    <div class="avatar-section">
                        <img id="avatarImg" src="/images/default-avatar.png" alt="头像" class="avatar-large">
                    </div>
                    <div class="basic-info">
                        <!-- 基本信息部分 -->
                        <h2 th:text="${student.name ?: '-'}">-</h2>
                        <p class="student-id">学号：<span th:text="${student.id ?: '-'}">-</span></p>
                        <p class="student-major">专业：<span th:text="${student.major ?: '-'}">-</span></p>
                        
                        <!-- 详细信息部分 -->
                        <div class="info-item">
                            <label>姓名：</label>
                            <span th:text="${student.name ?: '-'}">-</span>
                        </div>
                        <div class="info-item">
                            <label>性别：</label>
                            <span th:text="${student.gender ?: '-'}">-</span>
                        </div>
                        <div class="info-item">
                            <label>出生日期：</label>
                            <span th:text="${student.birthDate ?: '-'}">-</span>
                        </div>
                        <div class="info-item">
                            <label>专业：</label>
                            <span th:text="${student.major ?: '-'}">-</span>
                        </div>
                        <div class="info-item">
                            <label>班级编号：</label>
                            <span th:text="${student.classNumber ?: '-'}">-</span>
                        </div>
                        <div class="info-item">
                            <label>入学日期：</label>
                            <span th:text="${student.enrollmentDate ?: '-'}">-</span>
                        </div>
                        <div class="info-item full-width">
                            <label>地址：</label>
                            <span th:text="${student.address ?: '-'}">-</span>
                        </div>
                        <div class="info-item">
                            <label>联系电话：</label>
                            <span th:text="${student.phone ?: '-'}">-</span>
                        </div>
                        <div class="info-item">
                            <label>邮箱：</label>
                            <span th:text="${student.email ?: '-'}">-</span>
                        </div>
                    </div>
                </div>
            </div>

            <!-- 文件附件卡片 -->
            <div class="profile-card">
                <h3>相关文件</h3>
                <div class="files-section">
                    <div class="file-item">
                        <label>身份证件照片：</label>
                        <div id="idCardSection">
                            <span class="no-file">暂无文件</span>
                        </div>
                    </div>
                    <div class="file-item">
                        <label>其他附件：</label>
                        <div id="attachmentsSection">
                            <span class="no-file">暂无文件</span>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <script src="/js/student-profile.js"></script>
</body>
</html>